import React, { useState, useEffect } from 'react';
import { Pie } from '@ant-design/charts';
import { Tprops } from './types';
import { titleStyle } from './config';
import WarpDiv from './warp';

const ACPie: React.FC = (props:any) => {
  const data =props.data
  const config = {
    forceFit: true,
    title: {
      title: props.title,
      ...titleStyle
    },
    radius: 1,
    data,
    angleField: 'value',
    colorField: 'labelName',
    label: {
      text: 'value',
      style: {
        fontWeight: 'bold',
      },
    },
    legend: {
      color: {
        title: false,
        position: 'left',
        rowPadding: 0,
      },
    },
    tooltip:{
      title:(v:any)=>(`${v.labelName}`),
      items: [{ channel: 'y' ,name:'数量'}],
  },
  };
  return <WarpDiv> <Pie {...config} /></WarpDiv>;
};

export default ACPie;